#include("common.html")
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>澳邮国际商城</title>
    <meta name="description" content="澳邮国际商城">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <!-- 引入样式 -->
    <link rel="stylesheet" href="#(tpath)/static/css/element.css">
    <link rel="stylesheet" type="text/css" href="#(tpath)/static/css/basic.css">
    <link rel="stylesheet" type="text/css" href="#(tpath)/static/css/filter.css">
     <script src="#(tpath)/static/js/jquery.js"></script>
    <script src="#(tpath)/static/js/common.js"></script>
    <style type="text/css">
    .h2active{
    	border-bottom: 1px solid rgb(255, 85, 46); 
    	color: rgb(255, 85, 46);
    }
    h2.normal {
    top: 4px;
}
.register-top h2 {
    cursor: pointer;
    float: left;
    width: 142px;
    color: #666;
    font-size: 16px;
    line-height: 50px;
    font-weight: normal;
    margin-bottom: 25px;
}
h2.nopassword {
    top: 4px;
}
.register-top {
    text-align: center;
    margin: 0 auto;
}
.aui-login-armor {
    width: 70%;
    position: relative;
    z-index: 100;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 5px 7px 5px;
    margin: 0 auto;
}

.aui-tabBar-item {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #979797;
}
.aui-tabBar-item i {
    width: 54px;
    height: 54px;
    display: block;
    border: none;
    border-radius: 100%;
}

.wechatlogin {
    background: #24db5a url() no-repeat center center;
    background-size: 28px 28px;
}
.aui-login-line {
    position: relative;
    text-align: center;
    padding-top: 20px;
}
.aui-login-line h2 {
    font-size: 0.85rem;
    color: #CCCCCC;
    background: #ffffff;
    width: 120px;
    margin: 0 auto;
    z-index: 1002;
    position: relative;
}
.aui-login-line:after {
    content: '';
    position: absolute;
    z-index: 0;
    bottom: 10px;
    left: 10px;
    width: 95%;
    height: 1px;
    border-bottom: 1px solid #CCCCCC;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
}
    </style>
  </head>
  
  <body>
    <style type="text/css">.logregbg { background:#efefef; width: 100%; height: 100%; background-position: center top; background-size: cover; } .allwarpss { width: 1200px; margin: 0 auto; } .header_cart { height: 65px; padding-top: 35px; } .header_cart .logo { float: left; margin-top: -10px; } .header_cart .logo img{ max-height:60px; } .header_cart h1 { float: left; margin-left: 18px; border-left: 2px #dadada solid; padding-left: 14px; margin-top: 6px; font-size: 18px; } .logregbg .landr_right { width: 330px; background: #fff; height: 460px; margin: 80px auto; border-radius: 5px; } .logregbg .landr_right .lrright_cont { width: 285px; margin: 0 auto; padding-top: 20px; } .logregbg .landr_right .lrright_cont h3 { font-size: 18px; padding: 20px 0; } .layui-form-item { margin-bottom: 15px; clear: both; *zoom: 1; } .layui-input, .layui-textarea { display: block; width: 100%; padding-left: 10px; } .layui-input, .layui-select, .layui-textarea { height: 38px; line-height: 38px; line-height: 36px\9; border: 1px solid #e6e6e6; background-color: #fff; border-radius: 2px; } .layui-form-item:after { content: '\20'; clear: both; *zoom: 1; display: block; height: 0; } .layui-btn-normal { background-color: #1E9FFF; } .layui-btn { display: inline-block; height: 38px; line-height: 38px; padding: 0 18px; background-color: #009688; color: #fff; white-space: nowrap; text-align: center; border: none; border-radius: 2px; cursor: pointer; opacity: .9; filter: alpha(opacity=90); } .allwarpss .landr_right p { margin-bottom: 5px; } html{ height: 100%; } body{ height: 100%; } #login{ height: 100%; } .ft_size14{ float: right; } .radio-group{ margin: 10px 0px; } .captcha_content{ width: 100%; display: flex; margin-top: 10px; } .captcha_left{ flex: 1.5; margin-right: 10px; } .captcha_right{ flex: 0.5; } .el-button--danger{ width: 100%; margin-top: 10px; } .el-button--primary{ width: 100%; margin-top: 10px; } .el-button+.el-button { margin-left: 0px; margin-top: 10px; } .back_bt{ width: 100%; } hr { height: 1px; margin-top: 20px; border: 0; background-color: #e2e2e2; clear: both; } a:hover{ color: #333; } .welcome-txt{ font-size: 14px; margin-bottom: 20px; } .login-txt{ float: right; color: #428bca; font-size: 14px; } .new-pws{ margin-top: 10px; } .el-radio{line-height: 27px;}</style>
    <div id="login">
      <div class="logregbg">
        <div class="allwarpss">
          <div class="header_cart">
            <div class="logo">
              <a href="#(base)/">
                <img src="#(base)/static/images/pclogo.png"></a>
            </div>
            <h1>会员登录&amp;注册</h1></div>
          <div class="landr_right">
            <div class="lrright_cont">
              <span class="welcome-txt">欢迎登录</span>
              <div class="login-txt">
                <a href="#(base)/register">注册</a></div>
              <div class="cl"></div>
              <hr>
              <br>
              <div class="register-top" id="reg-top">
	              <h2 class="normal h2active" id="normal">密码登录</h2>
				  <h2 class="nopassword" id="nopw">短信登录</h2>
              </div>
              <form class="layui-form" id="passwordLogin">
                <div class="el-input el-input--suffix">
                  <!---->
                  <input type="text" autocomplete="off" placeholder="输入注册手机号码" class="el-input__inner" id="username" value="19908488901">
                  <!---->
                  <!---->
                  <!---->
                  <!----></div>
                <div class="el-input el-input--suffix" style="margin-top: 10px;">
                  <!---->
                  <input type="password" autocomplete="off" placeholder="至少6位数密码" class="el-input__inner" id="password" value="123456">
                  <!---->
                  <span class="el-input__suffix">
                    <span class="el-input__suffix-inner">
                      <!---->
                      <!---->
                      <!---->
                      <!----></span>
                    <!----></span>
                  <!---->
                  <!----></div>
                <button type="button" class="el-button el-button--primary" id="loginBtn">
                  <!---->
                  <!---->
                  <span>点击登录</span></button>
                <p style="margin-top: 10px; text-align: right; font-size: 14px;">
                  <a href="#(base)/password">忘记密码？</a></p>
              </form>
              <form class="layui-form" style="display: none;" id="smsLogin">
                <div class="el-input el-input--suffix">
                  <!---->
                  <input type="text" autocomplete="off" placeholder="输入注册手机号码" class="el-input__inner" id="smsusername">
                  <!---->
                  <!---->
                  <!---->
                  <!----></div>
                <div class="captcha_content">
                  <div class="captcha_left el-input el-input--suffix">
                    <!---->
                    <input type="text" autocomplete="off" placeholder="输入图形验证码" class="el-input__inner" id="captcha">
                    <!---->
                    <!---->
                    <!---->
                    <!----></div>
                  <img src="#(base)/common/captcha/image" onclick="this.src='#(base)/common/captcha/image?'+Math.round(Math.random()*10);" class="captcha_right"></div>
                <div class="captcha_content">
                  <!---->
                  <div class="captcha_left el-input el-input--suffix">
                  <input type="text" autocomplete="off" placeholder="请输入短信验证码" class="el-input__inner" id="code">
                  </div>
                  <button type="button" class="el-button send_sms el-button--success el-button--small captcha_right" id="sendCaptchaBtn" onclick="getVerify()">
                  <!---->
                  <!---->
                  <span id="getCode">发送验证码</span></button>
                  <!---->
                  <!---->
                  <!---->
                  <!---->
                 </div> 
                <button type="button" class="el-button el-button--primary" id="smsloginBtn">
                  <!---->
                  <!---->
                  <span>点击登录</span></button>
              </form>
              
                  
              
            </div>
              <div class="aui-login-line">
                    <h2>第三方登录</h2>
                </div> 
              
              <div class="aui-login-armor">
                    <a href="#(base)/login/weixin" class="aui-tabBar-item">
                        <i class="wechatlogin"></i>
                    </a>
                </div>
          </div>
          <div style="color: rgb(204, 204, 204); text-align: center;">@2016-2019 AUGLOBLE All Rights Reserved</div>
          
          </div>
      </div>
    </div>
    <style type="text/css">#footer{margin-top: 50px;} .footer-secbg { border-top: 1px solid #e4e4e4; height: 60px; overflow: hidden; color: #ccc; text-align: center; line-height: 60px; } .footer-secbg a{color: #fff;} .footer-secbg p { font-size: 14px; } }</style>
    <!-- <div id="footer">
      <div class="footer-secbg">
        <p class="cp">@2016-2019 AUGLOBLE All Rights Reserved</p></div>
    </div> -->
  </body>

</html>
<script type="text/javascript">

var c=60;
var t;
var issend = false;
var returl = '';
function timedCount(){
    $('#getCode').html(c+"s");
    c=c-1;
    t=setTimeout("timedCount()",1000);
    if(c==0){
        stopCount();
    }
}

function stopCount(){
    clearTimeout(t);
    $('#getCode').html('发送验证码');
    issend = false;
    c=60;
}

function getVerify(){
    if(issend && c > 0){
        return;
    }
    var captcha = $("#captcha").val();
	if(captcha==""){
		alert('请输入验证码！');
		return false;
	}
	$.ajax({
        url: "#(base)/common/sms/sendLogin",
        type: "post",
        data: {"captcha":captcha,"mobile":$('#smsusername').val()},
        dataType: "json",
        success: function(res){
        	if(res.type=="success"){
			    issend = true;
			    timedCount();
       		}else{
       			alert(res.msg);
       		}
        },
        error: function(res){
        }
    });
}


$("#normal").on("click",function(){
	$("#passwordLogin").show();
	$("#smsLogin").hide();
	$("#normal").addClass("h2active");
	$("#nopw").removeClass("h2active");
});

$("#nopw").on("click",function(){
	$("#passwordLogin").hide();
	$("#smsLogin").show();
	$("#normal").removeClass("h2active");
	$("#nopw").addClass("h2active");
});

$("#loginBtn").on("click",function(){
	$.ajax({
        url: "#(base)/login/password",
        type: "post",
        data: {"username":$('#username').val(),"password":$('#password').val()},
        dataType: "json",
        success: function(res){
        	if(res.type=="success"){
       			location.href="#(base)/"
       		}else{
       			alert(res.msg);
       		}
        },
        error: function(res){
        }
    });
});

$("#smsloginBtn").on("click",function(){
	$.ajax({
        url: "#(base)/login/sms",
        type: "post",
        data: {"username":$('#smsusername').val(),"code":$('#code').val()},
        dataType: "json",
        success: function(res){
        	if(res.type=="success"){
       			location.href="#(base)/"
       		}else{
       			alert(res.msg);
       		}
        },
        error: function(res){
        }
    });
});

</script>